<template>
    <!-- #ifdef APP-NVUE -->
    <cell
        v-for="(item, index) in conversationList"
		
        :key="item.conversationID"
        style="margin:0;padding:0;"
        :class="{cellHide:item.cellHide}"
    >
        <!-- #endif -->
        <!-- #ifndef APP-NVUE -->
        <view v-for="(item, index) in conversationNewList" :key="item.conversationID">
            <!-- #endif -->
			<!--index <= showConversation && -->
            <view
				:style="{backgroundColor: item.isPinned?'#CDFAED':'#ffffff'}"
                class="psr list_item d-flex d-r j-center"
                v-if="visibleByConversationSearch(item)"
                :class="{
                    del: item.delete,
                    needAni: needAni,
                    active: listActive === index,
                }"
            >
                <!-- v-model:open-status="item.openStatus" -->
                <!-- <tm-slide-switch
                    :width="750"
                    :height="145"
                    :right-width="545"
                    :transprent="true"
                > -->
                <fui-swipe-action
				
                    :autoClose="true"
                    @change="
                        (data:any) => {
                            swipeChange(data, item);
                        }
                    "
                >
                    <!-- @longpress="handleItemLongpress(item)" -->
                    <view
                        class="TUI-conversation-item d-flex d-r a-center"
                        @tap="handleGotoItem(item, index)"
                    >
                        <view class="left_box1">
                            <!-- item.unreadCount  item.messageRemindType === 'AcceptNotNotify' -->

                            <!-- "item.messageRemindType === 'AcceptNotNotify'?null:item.unreadCount" -->
                            <tm-badge
                                v-if="item.type !== '@TIM#SYSTEM'"
                                :dot="
                                    item.unreadCount > 0 &&
                                    item.messageRemindType === 'AcceptNotNotify'
                                "
                                :count="
                                    item.messageRemindType === 'AcceptNotNotify'
                                        ? null
                                        : item.unreadCount
                                "
                                :maxCount="99"
                                :padding="[3.5, 3.5]"
                                :top="
                                    item.messageRemindType === 'AcceptNotNotify'
                                        ? 10
                                        : 0
                                "
                                :left="
                                    item.messageRemindType === 'AcceptNotNotify'
                                        ? 80
                                        : 70
                                "
                                color="#FF5831"
                            >
							
                                <view style="align-items: center;" class="box1 d-flex d-r a-center j-center">
									<userhead
									    :width="100"
									    :height="100"
									    :saveKey="getUserHeadSaveKey(item)"
									    :isVip="getUserHeadIsVip(item)"
									    :src="getUserHeadSrc(item)"
									/>
									<!--
                                    <view
                                        class="psr avatar_box d-flex d-r a-center j-center"
                                    >
									-->
                                        

                                        <!-- <cacheimg
                                            style="width:94rpx;height:94rpx;border-radius:1000px;"
                                            mode="aspectFill"
                                            :saveKey="getKey(item)"
                                            :src="handleItemAvator(item)"
                                        ></cacheimg> -->
                                        <!-- <view
                                            v-if="item.type === 'GROUP'"
                                            class="tag d-flex d-r a-center j-center"
                                        >
                                            <text class="text">群</text>
                                        </view> -->
										<!--
                                    </view>
									-->
                                </view>
                            </tm-badge>

                            <tm-image
                                v-else
                                class="avatar"
                                :width="100"
                                :height="100"
                                :src="handleItemAvator(item)"
                            ></tm-image>
                        </view>

                        <view class="msg_content d-flex d-c j-center">
                            <view class="name">
                                <image
                                    class="circle_dot"
                                    v-if="item.type === 'GROUP'"
                                    src="/static/nvue/chat-icon.png"
                                    mode=""
                                />
                                <text class="text" :class="{isVip:getUserHeadIsVip(item)}">{{handleItemName(item)}}</text>

                                <view v-if="item.conversationID==='C2C10001'||item.conversationID==='C2C10000'||item.conversationID==='C2Cadminkefu'" class="guanfang">
                                    <text class="text">官方</text>
                                </view>

                                <!-- <rich-text :nodes="item.nodes"></rich-text> -->
                                <!-- <button @tap.stop="del1(item)">删除</button> -->
                                <!-- <button @tap.stop="handleMute(item)">MUTE</button> -->
                            </view>
                            <view class="message d-flex d-r ell">
                                <!-- v-if="item.groupAtInfoList&&item.groupAtInfoList.length" -->
                                <text
                                    v-if="
                                        item.groupAtInfoList &&
                                        item.groupAtInfoList.length
                                    "
                                    class="text ell"
                                    style="
                                        color: red;
                                        lines: 1;
                                        margin-right: 5px;
                                    "
                                    >[有人@我]</text
                                >

                                <text
                                    v-if="
                                        item.groupAtInfoList &&
                                        item.groupAtInfoList.length
                                    "
                                    style="margin-right: 5px; lines: 1"
                                    class="text ell"
                                    >{{ item.lastMessage.nick }}:</text
                                >

                                <text
                                    style="lines: 1; flex: 1"
                                    class="text ell"
                                    >{{ handleItemMessage(item) }}</text
                                >
                            </view>
                        </view>
                        <view class="right_status d-flex d-c j-center">
                            <view class="time d-flex d-r a-center nowrap">
                                <text class="text">
                                    {{
                                        handleItemTime(
                                            item.lastMessage.lastTime
                                        )
                                    }}
                                </text>
                            </view>
                            <view class="statu d-flex d-r a-center">
                                <image
                                    v-if="item.isPinned"
                                    class="icon1"
                                    src="/static/nvue/top.png"
                                    mode=""
                                />

                                <image
                                    v-if="
                                        item.messageRemindType ===
                                        'AcceptNotNotify'
                                    "
                                    class="icon1"
                                    src="/static/nvue/mute.png"
                                    mode=""
                                />
                            </view>
                        </view>
                    </view>
                    <!-- <template v-slot:buttons>
                        <view class="slide_right d-flex d-r">
                            
                            <view class="slide_btn btn1 d-flex a-center j-center" @tap="handlePinned(item)">
                                <text class="text">{{ item.isPinned ? '取消置顶':'消息置顶' }}</text>
                            </view>
                            <view class="slide_btn btn2 d-flex a-center j-center" @tap="handleMute(item)">
                                <text class="text">{{ item.messageRemindType==='AcceptAndNotify'? '免打扰':'取消免打扰' }}</text>
                            </view>
                            <view class="slide_btn btn3 d-flex a-center j-center" @touchstart.stop="" @tap.stop="handleDel(item)">
                               <text class="text">删除</text>
                            </view>
                        </view>
                    </template> -->

                    <template v-slot:button1>
                        <view
                            class="slide_btn btn1 d-flex a-center j-center"
                            @tap="handlePinned(item)"
                        >
                            <text class="text">{{
                                item.isPinned ? "取消置顶" : "消息置顶"
                            }}</text>
                        </view>
                    </template>

                    <template v-slot:button2>
                        <view
                            class="slide_btn btn2 d-flex a-center j-center"
                            @tap="handleMute(item)"
                        >
                            <text class="text">{{
                                item.messageRemindType === "AcceptAndNotify"
                                    ? "免打扰"
                                    : "取消免打扰"
                            }}</text>
                        </view>
                    </template>

                    <template v-slot:button3>
                        <view
                            class="slide_btn btn3 d-flex a-center j-center"
                            @tap="handleDel(item)"
                        >
                            <text class="text">删除</text>
                        </view>
                    </template>

                    <!-- </tm-slide-switch> -->
                </fui-swipe-action>
                <view
                    v-if="index !== conversationList.length - 1"
                    class="line"
                ></view>
            </view>
            <!-- #ifndef APP-NVUE -->
        </view>
        <!-- #endif -->
        <!-- #ifdef APP-NVUE -->
    </cell>
    <!-- #endif -->
</template>
<script lang="ts">
import {
    defineComponent,
    ref,
    computed,
    nextTick,
    reactive,
    toRefs,
    watchEffect,
    onMounted,
    onUnmounted,
	watch,
	onBeforeMount,
} from "vue";
import { caculateTimeago, formatMessageTime1 } from "../../utils/date";
import { imStore } from "@/store/imStore";
import { userData } from "@/store/userData";
import cacheimg from "@/components/cacheimg.vue";
import fuiSwipeactionGroup from "@/components/fui-swipeaction-group/fui-swipeaction-group.vue";
import fuiSwipeAction from "@/components/fui-swipe-action/fui-swipe-action.vue";
import userhead from "@/components/userhead.vue";
import { network } from "@/store/network";
const TUIConversationList = defineComponent({
    props: {
        conversationList: {
            type: Array,
            default: () => {
                return [];
            },
        },
        conversationNewList:{
            type: Array,
            default: () => {
                return [];
            },
        },
        currentID: {
            type: String,
            default: () => {
                return "";
            },
        },
		showConversation: {
		    type: Number,
		    default: () => {
		        return 15;
		    },
		},
    },
    components: {
        cacheimg,
        userhead,
        fuiSwipeactionGroup,
        fuiSwipeAction,
    },
	emits: ['handleGotoItem'],
	
    setup(props: any, ctx: any) {
		
        const IM_STORE = imStore();
        const NETWORK = network();

        const needAni = ref(false);

        let first = null;

        const obj = reactive({
            conversationList: [] as any,
            currentID: "",
            isOpened: "none",
            currentConversation: {} as any,
            dialogID: "",
            deleteId: null,
        });

        const conversationGroupUpdated = ()=>{
            obj.conversationList = IM_STORE.conversationList;
        }
        // const conversationList = computed(() => {
        //     let arr = props.conversationList
        // });

        watch(()=>props.conversationNewList,()=>{
			
			//console.log("conversationNewList watch------------",props.conversationNewList)
		})
		onBeforeMount(()=>{
			uni.hideLoading()
		})
        onMounted(() => {
			
            //console.log("conversationNewList------------",props.conversationNewList.length,props.conversationNewList)
            uni.$on("fadeActive", fadeActive);
            uni.$on("conversationGroupUpdated", conversationGroupUpdated);
        });
        onUnmounted(() => {
            uni.$off("fadeActive", fadeActive);
            uni.$off("conversationGroupUpdated", conversationGroupUpdated);
        });

        const fadeActive = () => {
            conversationGroupUpdated()
            needAni.value = true;
            setTimeout(() => {
                listActive.value = null;
                setTimeout(() => {
                    needAni.value = false;
                }, 300);
            }, 100);
        };

        // 处理昵称

        const handleItemNameFun = (item: any)=>{
            let name = "";

            let group_nick = null;
            if (
                item.groupProfile &&
                item.groupProfile.selfInfo &&
                item.groupProfile.selfInfo.memberCustomField &&
                item.groupProfile.selfInfo.memberCustomField.length
            ) {
                item.groupProfile.selfInfo.memberCustomField.forEach((item:any) => {
                    if (item.key === "group_nick") {
                        group_nick = item.value;
                    }
                });
            }

            switch (item.type) {
                case uni.$TIM.TYPES.CONV_C2C:
                    name =
                        item?.remark ||
                        item?.userProfile.nick ||
                        item?.userProfile?.userID ||
                        "";
                    break;
                case uni.$TIM.TYPES.CONV_GROUP:
                    name =
                        group_nick ||
                        item.groupProfile.name ||
                        item?.groupProfile?.groupID ||
                        "";
                    break;
                case uni.$TIM.TYPES.CONV_SYSTEM:
                    name = "系统通知";
                    break;
            }
            return name;
        }

        const handleItemName = computed(() => (item: any) => {
            let name = "";

            let group_nick = null;
            if (
                item.groupProfile &&
                item.groupProfile.selfInfo &&
                item.groupProfile.selfInfo.memberCustomField &&
                item.groupProfile.selfInfo.memberCustomField.length
            ) {
                item.groupProfile.selfInfo.memberCustomField.forEach((item) => {
                    if (item.key === "group_nick") {
                        group_nick = item.value;
                    }
                });
            }

            switch (item.type) {
                case uni.$TIM.TYPES.CONV_C2C:
                    name =
                        item?.remark ||
                        item?.userProfile.nick ||
                        item?.userProfile?.userID ||
                        "";
                    break;
                case uni.$TIM.TYPES.CONV_GROUP:
                    name =
                        group_nick ||
                        item.groupProfile.name ||
                        item?.groupProfile?.groupID ||
                        "";
                    break;
                case uni.$TIM.TYPES.CONV_SYSTEM:
                    name = "系统通知";
                    break;
            }
            return name;
        });

        // const handleItemName = (item: any) => {
        //     let name = "";

        //     let group_nick = null;
        //     if (
        //         item.groupProfile &&
        //         item.groupProfile.selfInfo &&
        //         item.groupProfile.selfInfo.memberCustomField &&
        //         item.groupProfile.selfInfo.memberCustomField.length
        //     ) {
        //         item.groupProfile.selfInfo.memberCustomField.forEach((item) => {
        //             if (item.key === "group_nick") {
        //                 group_nick = item.value;
        //             }
        //         });
        //     }

        //     switch (item.type) {
        //         case uni.$TIM.TYPES.CONV_C2C:
        //             name =
        //                 item?.remark ||
        //                 item?.userProfile.nick ||
        //                 item?.userProfile?.userID ||
        //                 "";
        //             break;
        //         case uni.$TIM.TYPES.CONV_GROUP:
        //             name =
        //                 group_nick ||
        //                 item.groupProfile.name ||
        //                 item?.groupProfile?.groupID ||
        //                 "";
        //             break;
        //         case uni.$TIM.TYPES.CONV_SYSTEM:
        //             name = "系统通知";
        //             break;
        //     }
        //     return name;
        // };


        const matchTextHighLight = () => {
            const conversationSearch = IM_STORE.conversationSearch;
            const reg = new RegExp(conversationSearch, "gi");
            obj.conversationList = obj.conversationList.map((item) => {
                const obj = {
                    ...item,
                };
                // const str = `<div style="color:#555;">${item.profile.nick}</div>`;
                const str = item.showName;
                const nodes = `<div style="color:#333;font-weight:600;">${str.replace(
                    reg,
                    (s: any) => {
                        return `<span style="color:#23e2a6;font-weight:600;">${s}</span>`;
                    }
                )}</div>`;
                obj.nodes = nodes;
                return obj;
            });
        };

        watchEffect(() => {
            const conversationSearch = IM_STORE.conversationSearch;

            // obj.conversationList = props.conversationList.filter((item) => {
            //     if(item.conversationID==='@TIM#SYSTEM'){
            //         return false;
            //     }
            //     return item;
            // });

            //obj.conversationList = props.conversationList;



                props.conversationList.forEach((item) => {
                    // if(item.conversationID==='@TIM#SYSTEM'){
                    //     return false;
                    // }

                    if(!conversationSearch){
                        item.cellHide = false;
                        return;
                    }

                    const str = handleItemNameFun(item);
                    if (
                        str
                            .toLowerCase()
                            .search(conversationSearch.toLowerCase()) !== -1
                    ) {
                        item.cellHide = false;
                    } else {
                        item.cellHide = true;
                    }

                    //return true;
                });


             obj.conversationList = props.conversationList;

            //matchTextHighLight();

            // if (obj.deleteId) {
            //     if (
            //         props.conversationList.every(
            //             (item) => item.conversationID !== obj.deleteId
            //         )
            //     ) {
            //         obj.conversationList = props.conversationList.map(
            //             (item) => {
            //                 return {
            //                     ...item,
            //                     openStatus: false,
            //                     delOpen: false,
            //                     delete: false,
            //                 };
            //             }
            //         );

            //         obj.deleteId = null;
            //     }
            // } else {
            //     // obj.conversationList = props.conversationList.map((item) => {
            //     //     return {
            //     //         ...item,
            //     //         openStatus: false,
            //     //         delOpen: false,
            //     //         delete: false,
            //     //     };
            //     // });
            // }

            // console.log('obj.conversationList')
            // console.log(obj.conversationList)

            obj.currentID = props.currentID;
        });

        const handlePinned = (item: any) => {
            if(!NETWORK.statu){
                uni.showToast({
                    icon: "none",
                    title: "没有网络,请检查",
                    duration: 2500,
                });
                return;
            }
            handleItemLongpress(item);
            if (item.isPinned) {
                handleConversation("dispinned");
            } else {
                handleConversation("ispinned");
            }
        };

        const handleMute = (item: any) => {
            if(!NETWORK.statu){
                uni.showToast({
                    icon: "none",
                    title: "没有网络,请检查",
                    duration: 2500,
                });
                return;
            }
            handleItemLongpress(item);
            if (item.messageRemindType === "AcceptAndNotify") {
                handleConversation("mute");
            } else {
                handleConversation("notMute");
            }
        };

        const handleDel = (item: any) => {
            if(!NETWORK.statu){
                uni.showToast({
                    icon: "none",
                    title: "没有网络,请检查",
                    duration: 2500,
                });
                return;
            }
            if (!item.delOpen) {
                return;
            }
            handleItemLongpress(item);
            handleConversation("delete", item);
        };
        const del1 = (item: any) => {
            // if(!item.delOpen) {
            //     return;
            // }
            console.log("del1");
            console.log(item);
            handleItemLongpress(item);
            handleConversation("delete", item);
        };

        const swipeChange = (data: any, item: any) => {
            // console.log('swipeChangeswipeChangeswipeChange')
            // console.log('swipeChangeswipeChangeswipeChange')
            // console.log('swipeChangeswipeChangeswipeChange')
            // console.log('swipeChangeswipeChangeswipeChange')
            // console.log(data)
            const { isOpen, delOpen } = data;
            item.openStatus = isOpen;
            item.delOpen = delOpen;
            // obj.conversationList.forEach(con=>{
            //     if(con.conversationID===item.conversationID){
            //         con.openStatus = isOpen;
            //         con.delOpen = delOpen;
            //     }
            // })
        };

        const listActive = ref();

        const handleGotoItem = (item: any, index: number) => {
            if(!NETWORK.statu){
                uni.showToast({
                    icon: "none",
                    title: "没有网络,请检查",
                    duration: 2500,
                });
                return;
            }


            if (handleGotoItemFlag) {
                return;
            }

            handleGotoItemFlag = true;

            setTimeout(() => {
                handleGotoItemFlag = false;
            }, 1000);

            if (item.openStatus) {
                handleGotoItemFlag = false;
                //item.openStatus = false;
                return;
            }

            listActive.value = index;
            ctx.emit("handleGotoItem", item);
        };

        const getUserHeadSaveKey = computed(() => (item: any) => {
            if (item.type === "C2C") {
                return item.userProfile.userID;
            }

            if (item.type === "GROUP") {
                return item.groupProfile.groupID;
            }
        });
        const getUserHeadIsVip = computed(() => (item: any) => {
            if (item.type === "C2C") {
                return Number(item.userProfile.level);
            }

            if (item.type === "GROUP") {
                return 0;
            }
        });
        const getUserHeadSrc = computed(() => (item: any) => {
            if (item.type === "C2C") {
                return item.userProfile.avatar;
            }

            if (item.type === "GROUP") {
                return item.groupProfile.avatar;
            }
        });

        // 处理头像

        const getKey = (item: any) => {
            let key = "";
            switch (item.type) {
                case uni.$TIM.TYPES.CONV_C2C:
                    key = item?.userProfile?.userID || null;
                    break;
                case uni.$TIM.TYPES.CONV_GROUP:
                    key = item?.groupProfile?.groupID || null;
                    break;
                case uni.$TIM.TYPES.CONV_SYSTEM:
                    key =
                        item?.groupProfile?.avatar ||
                        "https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png";
                    break;
            }

            return key;
        };

        const handleItemAvator = (item: any) => {
            let avatar = "";
            switch (item.type) {
                case uni.$TIM.TYPES.CONV_C2C:
                    avatar =
                        item?.userProfile?.avatar ||
                        "https://web.sdk.qcloud.com/component/TUIKit/assets/avatar_21.png";
                    break;
                case uni.$TIM.TYPES.CONV_GROUP:
                    avatar =
                        item?.groupProfile?.avatar ||
                        "https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png";
                    break;
                case uni.$TIM.TYPES.CONV_SYSTEM:
                    avatar =
                        item?.groupProfile?.avatar ||
                        "https://web.sdk.qcloud.com/component/TUIKit/assets/group_avatar.png";
                    break;
            }

            return avatar;
        };

        const visibleByConversationSearch = computed(() => (item: any) => {
            // console.log("visibleByConversationSearch");
            // console.log("visibleByConversationSearch");
            // console.log("visibleByConversationSearch");

            const conversationSearch = IM_STORE.conversationSearch;

            // console.log(conversationSearch);

            // console.log(item);

            if (!conversationSearch) {
                return true;
            }

            if (!item) {
                return true;
            }

            const str = handleItemNameFun(item);

            console.log(str);

            if (
                str.toLowerCase().search(conversationSearch.toLowerCase()) !==
                -1
            ) {
                return true;
            } else {
                return false;
            }
        });

        // const visibleByConversationSearch = (item: any) => {

        //     console.log('visibleByConversationSearch');
        //     console.log('visibleByConversationSearch');
        //     console.log('visibleByConversationSearch');

        //     const conversationSearch = IM_STORE.conversationSearch;

        //     console.log(conversationSearch);

        //     console.log(item)

        //     if (!conversationSearch) {
        //         return true;
        //     }

        //     if (!item) {
        //         return true;
        //     }

        //     const str = handleItemName(item);

        //     console.log(str);

        //     if (
        //         str.toLowerCase().search(conversationSearch.toLowerCase()) !==
        //         -1
        //     ) {
        //         return true;
        //     } else {
        //         return false;
        //     }
        // };

        // 处理时间
        const handleItemTime = (time: number) => {
            // if (time > 0) {
            //     return caculateTimeago(time * 1000);
            // }
            if (time > 0) {
                return formatMessageTime1(time * 1000);
            }
            return "";
        };
        // 处理lastMessage
        const handleItemMessage = (conversation: any) => {
            const { lastMessage: message,type } = conversation;
            const USER_DATA = userData();

            // console.log(conversation)
            // console.log(conversation)


            let r = message.revoker || message.fromAccount;
                const p =
                    r === USER_DATA.id
                        ? ''
                        : `${
                              message.nameCard ||
                              message.nick ||
                              message.from ||''
                          }`;
                let p1 = '';

                if(r === USER_DATA.id){
                    p1 = '"你"'
                }else{
                    if(message.nameCard ||message.nick ||message.from){
                        p1 = `"${
                              message.nameCard ||
                              message.nick ||
                              message.from 
                          }"`
                    }else{
                    }
                }

            if (message.isRevoked) {



                return `${p1} 撤回了一条消息`;
            }
            switch (message.type) {

                case uni.$TIM.TYPES.MSG_TEXT:

                    if(type==='GROUP'&&p){
                        return `${p}: ${message.payload.text||''}`
                    }

                    return message.payload.text||''

                    // if(type==='GROUP'){
                    //     return `${p}:${message.payload.text}`;
                    // }

                case "TIMCustomElem":
                    // let extension = {}
                    // try {
                    //     extension=JSON.parse(message.payload.extension)
                    // } catch (error) {

                    // }

                    return message.payload.description
                        ? `[${message.payload.description}]`
                        : message.messageForShow;
                default:
                    if(type==='GROUP'&&p){
                        return `${p}: ${message.messageForShow}`
                    }


                    return `${message.messageForShow}`;
            }
        };

        let handleGotoItemFlag = false;

        const handleItemLongpress = (item: any) => {
            obj.conversationList.forEach((aa) => {
                aa.openStatus = false;
            });
            obj.currentConversation = item;
            obj.dialogID = item.conversationID;
            if (item.type === "C2C") {
                obj.currentuserID = item.userProfile.userID;
            } else if (item.type === "GROUP") {
                obj.currentuserID = item.groupProfile.groupID;
            }
            obj.conversationType = item.type;
        };

        // todo
        const handlerIsOpened = (item: any) => {
            if (item.conversationID === obj.doalogID) {
                return "right";
            } else {
                return "none";
            }
        };

        // 删除会话,后续TODO,置顶聊天,消息免打扰
        const handleConversation = (type: string, item?: any) => {
            switch (type) {
                case "delete":
                    needAni.value = true;
                    //obj.deleteId = item.conversationID;
                    nextTick(() => {
                        item.delete = true;
                        // obj.conversationList.forEach(con=>{
                        //     if(con.conversationID===item.conversationID){
                        //         con.delete = true;
                        //     }
                        // })

                        // item.delete = true;
                        nextTick(() => {
                            setTimeout(() => {
                                needAni.value = false;
                                nextTick(() => {
                                    uni.$TUIKit.TUIConversationServer.deleteConversation(
                                        item.conversationID
                                    ).then((imResponse: any) => {
                                        //const { conversationID } = imResponse.data;
                                    });
                                });
                                //obj.dialogID = "";
                            }, 300);
                        });
                    });

                    //item.delete = true;

                    break;
                case "ispinned":
                    if (type === "ispinned") {
                        const options: any = {
                            conversationID: obj.dialogID,
                            isPinned: true,
                        };
                        uni.$TUIKit.TUIConversationServer.pinConversation(
                            options
                        ).then((imResponse: any) => {
                            //console.log(imResponse);
                        });
                    }
                    obj.dialogID = "";
                    break;
                case "dispinned":
                    if (type === "dispinned") {
                        const options: any = {
                            conversationID: obj.dialogID,
                            isPinned: false,
                        };
                        uni.$TUIKit.TUIConversationServer.pinConversation(
                            options
                        ).then((imResponse: any) => {});
                    }
                    obj.dialogID = "";
                    break;
                case "mute":
                    if (type === "mute" && obj.conversationType === "C2C") {
                        const options: any = {
                            userIDList: [obj.currentuserID],
                            messageRemindType:
                                uni.$TIM.TYPES.MSG_REMIND_ACPT_NOT_NOTE,
                        };
                        uni.$TUIKit.TUIConversationServer.muteConversation(
                            options
                        ).then((imResponse: any) => {
                            //console.log(imResponse);
                        });
                    } else if (
                        type === "mute" &&
                        obj.conversationType === "GROUP"
                    ) {
                        const options: any = {
                            groupID: obj.currentuserID,
                            messageRemindType:
                                uni.$TIM.TYPES.MSG_REMIND_ACPT_NOT_NOTE,
                        };
                        uni.$TUIKit.TUIConversationServer.muteConversation(
                            options
                        ).then((imResponse: any) => {
                            //console.log(imResponse);
                        });
                    }
                    obj.dialogID = "";
                    break;
                case "notMute":
                    if (type === "notMute" && obj.conversationType === "C2C") {
                        const options: any = {
                            userIDList: [obj.currentuserID],
                            messageRemindType:
                                uni.$TIM.TYPES.MSG_REMIND_ACPT_AND_NOTE,
                        };
                        uni.$TUIKit.TUIConversationServer.muteConversation(
                            options
                        ).then((imResponse: any) => {
                            //console.log(imResponse);
                        });
                    } else if (
                        type === "notMute" &&
                        obj.conversationType === "GROUP"
                    ) {
                        const options: any = {
                            groupID: obj.currentuserID,
                            messageRemindType:
                                uni.$TIM.TYPES.MSG_REMIND_ACPT_AND_NOTE,
                        };
                        uni.$TUIKit.TUIConversationServer.muteConversation(
                            options
                        ).then((imResponse: any) => {
                            //console.log(imResponse);
                        });
                    }
                    obj.dialogID = "";
                    break;
            }
        };
        return {
            ...toRefs(obj),
            visibleByConversationSearch,
            handleGotoItem,
            handleItemAvator,
            handleItemTime,
            handleItemMessage,
            handleItemName,
            handleItemNameFun,
            handleItemLongpress,
            handleConversation,
            handlerIsOpened,
            handlePinned,
            handleMute,
            handleDel,
            needAni,
            getKey,
            swipeChange,
            getUserHeadSaveKey,
            getUserHeadIsVip,
            getUserHeadSrc,
            listActive,
            fadeActive,
            del1,
        };
    },
});
export default TUIConversationList;
</script>

<style lang="scss">
.slide_btn {
    flex: 1;
    .text {
        color: #fff;
        font-size: 26rpx;
    }
    &.btn1 {
        background: #1dc691;
    }
    &.btn2 {
        background: #fab66b;
    }
    &.btn3 {
        background: #ff5831;
    }
}

.slide_right {
    position: relative;
    width: 480rpx;
    height: 125rpx;
}
</style>

<style lang="scss" scoped>
.ell {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    lines: 1;
}

.cellHide{
    height:0;
}

.list_item {
    width: 750rpx;
    overflow: hidden;
    height: 130rpx;
    transition: height 0 linear;
    overflow:hidden;
    margin:0;
    &.del {
        height: 0;
    }
    transition-property: height, background-color;
    transition-duration: 0.001s;
    transition-timing-function: linear;
    &.needAni {
        transition-duration: 0.3s;
        transition-timing-function: linear;
        // transition: height 0.2s linear;
    }

    &.del.needAni {
        height: 0;
    }
    background-color: #fff;
    // &:active {
    //     background: #f5f5f5;
    // }

    &.active {
        background-color: #f5f5f5;
    }

    .line {
        position: absolute;
        left: 140rpx;
        z-index: 10;
        width: 570rpx;
        height: 1rpx;
        background: #f5f5f5;
        border-radius: 3px;
        bottom: 0px;
    }
}

.TUI-conversation-list {
    list-style: none;
}

.TUI-conversation-item {
    position: relative;
    display: flex;
    align-items: center;
    width: 750rpx;
    height: 125rpx;
    padding: 0 30rpx ;
    .tag {
        position: absolute;
        width: 70rpx;
        height: 30rpx;
        background: #23e2a6;
        //border-radius: 20rpx 0rpx 20rpx 0rpx;
        border-radius: 20rpx;
        opacity: 1;
        z-index: 100;
        bottom: -10rpx;
        left: 15rpx;
        .text {
            color: #fff;
            font-size: 22rpx;
        }
    }

    .avatar {
        width: 94rpx;
        height: 94rpx;
        overflow: hidden;
        border-radius: 50rpx;
    }

    .box1 {
        width: 120rpx;
        height: 120rpx;
    }

    .avatar_box {
        width: 100rpx;
        height: 100rpx;
        border-radius: 50rpx;
        background: #fff;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
        overflow: hidden;
    }

    .msg_content {
        width: 400rpx;
        height: 85rpx;
        margin-left: 10rpx;

        .name {
            display: flex;
            flex-direction: row;
            align-items: center;
            height: 45rpx;

            .circle_dot {
                width: 28rpx;
                height: 28rpx;
                margin-right: 5rpx;
            }

            .text {
                font-size: 30rpx;
                color: #333;
                line-height: 45rpx;
                font-weight: 600;
                &.circle {
                    color: #23e2a6;
                }

                &.isVip{
                    color:#F19945;
                }
            }
        }

        .guanfang{
            width: 60rpx;
            height: 32rpx;
            background: #D2F4E9;
            border-radius: 4rpx;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-left:8rpx;


            .text{
                font-size:20rpx;
                color:#1DC691;
            }
        }

        .message {
            width: 400rpx;
            height: 40rpx;
            align-items: center;
            flex-wrap: nowrap;
            .text {
                font-size: 26rpx;
                color: #717072;
                line-height: 40rpx;
            }
        }
    }

    .right_status {
        width: 130rpx;
        height: 85rpx;
        .time {
            height: 45rpx;
            line-height: 45rpx;
            align-items: flex-end;
            justify-content: flex-end;
            .text {
                height: 45rpx;
                line-height: 45rpx;
                font-size: 26rpx;
                font-weight: 400;
                color: #999999;
            }
        }
        .statu {
            position: relative;
            align-items: center;
            justify-content: flex-end;
            height: 40rpx;
            .icon1 {
                width: 40rpx;
                height: 40rpx;
                margin-left: 10rpx;
            }
        }
    }
}
.selected {
    background: #edf0f5;
}
</style>
